<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>战队管理</title>
	<%@ include file="/view/common/tags.jsp"%>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1" name="viewport" />
    <meta content="" name="description" />
    <meta content="" name="author" />
<body>
<section class="content">
 	<div class="row"> 
    	<div class="col-md-12">
	     	<div class="box">
	            <div class="box-body">
	               <div class="panel panel-default">
	                    <div class="panel-body" style="padding-bottom:5px;">
	                        <form class="form-horizontal" action="/pubgTeam/list" method="post" id="pubgTeamForm">
	                            <div class="searchMenu">
									<div>
										<label>俱乐部：</label>
										<select class="form-control select" name="wm[CLUB_ID]">
											<option value="">请选择</option>
											<c:if test="${clubList != null && fn:length(clubList) > 0}">
												<c:forEach items="${clubList}" var="pubgClub">
													<option value="${pubgClub.rowId}">${pubgClub.clubName}</option>
												</c:forEach>
											</c:if>
										</select>
									</div>
	                                <div  class="mal10">
	                                    <button type="button"  class="btn btn-primary btn-sm"  onclick="findData()"><span class='glyphicon glyphicon-search'></span>查&nbsp;询</button>
	                                </div>
	                            </div>
	                        </form>
	                    </div>
	                </div>
	                <table class="table-scrollable table table-hover  table-bordered" id="pubgTeamTable" data-striped=true>
	                    <thead>
	                        <tr>
	                            <th data-field="index" data-align="center" data-formatter="indexFormatter" data-sortable="false">序号</th>
	                            <th data-field="teamName" data-align="center">战队名称</th>
								<th data-field="captainAccount" data-align="center" data-formatter="teamIntroFormatter">战队队长</th>
								<th data-field="teamAddress" data-align="center">地址</th>
								<th data-field="teamIntro" data-align="center" data-formatter="teamIntroFormatter">简介</th>
								<th data-field="teamPhoto" data-align="center" data-formatter="picUrlFormatter">图片</th>
								<th data-field="clubName" data-align="center">所属俱乐部</th>
								<th data-field="memberNum" data-align="center">队员数</th>
	                            <th data-field="settlementWay" data-align="center" data-formatter="settlementWayFormatter">结算方式</th>
								<th data-field="settlementRatio" data-align="center">结算比例</th>
	                            <th data-field="optButton" data-align="center" data-formatter="buttonFormatter">操作</th>
	                        </tr>
	                    </thead>
	                </table>
	            </div>
	        </div>
		</div>
	</div>
    <div id="showDiv" style="display:none;">
        <div class="well well_p" >
            <sk:form method="post" cssClass="form-horizontal" action="" target="_parent" id="saveOrupdateForm">
                <input type="hidden" id="rowId" name="rowId" value="">
                <div class="form-group">
                    <label class="col-xs-3 text-right">图片:</label>
                    <div class="col-xs-8">
                        <div class="cb_box cbx_img_bg">
                            <input type="hidden" name="externalLinkImg" id="externalLinkImg" value="">
                            <img id="newmainImgPath" src="${sysManagerV1}/images/uploadImage/noimage.gif" width="160px;" height="118px;" />
                            <br/>
                            <div class="mainImgPathBox">
                                <a href="javascript:;" class="file">选择文件<input id="imgPath" type="file" name="imgPath" onchange="newPic(this,'mainImgPath');"/></a>                    
                            </div>
                            <div class="exp_box" style="color:red;">建议尺寸为370*210px(jpg、bmp、png等)，<br/>并且小于1MB的图片。</div>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-3 text-right">跳转链接:</label>
                    <div class="col-xs-9">
                        <input type="text" class="form-control" name="externalLinkPath" id="externalLinkPath" value="" placeholder="跳转链接地址" onblur="valiMinisterNameBlur()">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-3 text-right">描述:</label>
                    <div class="col-xs-9">
                        <textarea class="remark" name="externalLinkDes" id="externalLinkDes" placeholder="200汉字以内" maxlength="200"></textarea>
                    </div>
                </div>
                <input type="hidden" id="isReCommit" value="0">
            </sk:form>
        </div>
    </div>
</section>
   <%@ include file="/view/common/footer.jsp"%>
</body>
<script>
    $(function(){
        if("${code}" == 1) {
            layer.msg("${msg}");
        }

        $("#pubgTeamTable").bootstrapTable({
            url: JSSYSMANAGERV1 + "/pubgTeam/listPubgTeam.json",
            method:"get",
            pagination:true,
            sidePagination:"server",
            queryParams: function(params) {
                return $.extend({}, params, parseJson(decodeURIComponent($("#pubgTeamForm").serialize())));
            }
        });
    })
    
    function findData(){
        $("#pubgTeamTable").bootstrapTable("refresh",{} );
    }
    
    // 战队介绍 格式化
    function teamIntroFormatter(value, row){
        if(value.length > 20){
            return "<span title='" + value + "'>" + value.substring(0, 18) + "...</span>"
        } else {
            return value;
        }
    }
    
    // 结算方式 格式化
    function settlementWayFormatter(value, row){
        if(value == 10){
            return "按比例"
        } else {
            return value;
        }
    }
    
    // 战队图片 格式化
    function picUrlFormatter(value, row) {
        var html="";
        if (value != null && value != "") {
            html = "<img src='"+value+"' width='80' height='80' onclick='openImage(\"" + value + "\")'/>";
		}
        return html;
    }
    
    // 查看大图
    function openImage(url){
        var infos = "<img src='" + url + "' style='width:100%; height:100%' />";
        layer.open({
            type: 1,
            title: false,
            shadeClose: true, //开启遮罩关闭
            area: ['70%', '70%'],
            content: infos
        });
    }
    
    // 按钮格式化
    function buttonFormatter(value, row){
    	//var rowJson = JSON.stringify(row).replace(/\"/g, "\\\""); //row的是一个对象
    	//var html = "<button id='btn_edit' type='button' onclick='editExternalLink(\""+rowJson+"\", 0"+");' class='btn btn-default btn-sm'><span class='glyphicon glyphicon-pencil'></span>维护战队广告</button>";
    	var html = "<button id='btn_edit' type='button' onclick='editExternalLink(\""+row.rowId+"\", \"" + row.externalLinkImg + "\", \"" + row.externalLinkPath + "\", \"" + row.externalLinkDes + "\", 0"+");' class='btn btn-default btn-sm'><span class='glyphicon glyphicon-pencil'></span>维护战队广告</button>";
    	//html += "<button id='btn_edit' type='button' onclick='view(\""+row.rowId+"\", \"" + row.externalLinkImg + "\", \"" + row.externalLinkPath + "\", \"" + row.externalLinkDes + "\", 0"+");' class='btn btn-default btn-sm'><span class='glyphicon glyphicon-info-sign'></span>查看战队广告</button>";
    	return html;
    }
    
    // 维护战队广告
    function editExternalLink(rowId, externalLinkImg, externalLinkPath, externalLinkDes, flag){
    	$("#isReCommit").val(0);
    	$("#rowId").val(rowId);
  		$("#newmainImgPath").attr("src", "${sysManagerV1}/images/uploadImage/noimage.gif");
      	$("#externalLinkPath").val("");
      	$("#externalLinkDes").val("");
    	if(externalLinkImg != undefined && externalLinkImg != 'undefined'){
    		$("#newmainImgPath").attr("src", externalLinkImg);
    	}
    	if(externalLinkPath != undefined && externalLinkPath != 'undefined'){
        	$("#externalLinkPath").val(externalLinkPath);
    	}
    	if(externalLinkDes != undefined && externalLinkDes != 'undefined'){
        	$("#externalLinkDes").val(externalLinkDes);
    	}
        var bjtsIndex = layer.open({
            type: 1,
            title: "战队广告维护",
            area: ['500px', '500px'],
            content: $("#showDiv"),
            btn: ["确 认", "关 闭"], 
            yes: function(index, layero){
                
                var externalLinkImg = $("#imgPath").val();
                if ((externalLinkImg == undefined && externalLinkImg == 'undefined') && !CheckUtil.isNotNull(externalLinkImg)) {
                    layer.msg("请选择图片!");
                    return;
                }
                
                var externalLinkPath = $("#externalLinkPath").val();
                if (CheckUtil.isNotNull(externalLinkPath) && !CheckUtil.isUrl(externalLinkPath)) {
                    layer.msg("请填写正确的链接地址!");
                    return;
                }
                
            	var isReCommit = $("#isReCommit").val();
            	if(isReCommit == 1){
                    layer.msg("请勿重复提交!");
                    return;
            	}
                $("#isReCommit").val(1); // 防止重复提交
                $.ajax({
                    type: "post",
                    url: "${sysManagerV1}/pubgTeam/editExternalLink",
                    data: new FormData($("#saveOrupdateForm")[0]),
                    dataType:"json",
                    processData: false,
                    contentType: false,
                    async:false,
                    success: function(data){
                        if(data.code == 0){
                            layer.msg("保存成功！");
                            layer.close(bjtsIndex);
                            findData();
                        } else if (data.code == -2) {
                            window.location.href = "${sysManagerV1}/";
                        } else{
                            layer.msg(data.message);
                            layer.close(bjtsIndex);
                            findData();
                        }
                    }
                });
            }
        });
    }

    // 显示战队广告
    function view(rowId, externalLinkImg, externalLinkPath, externalLinkDes, flag){
        $("#rowId").val(rowId);
        $("#newmainImgPath").attr("src", "${sysManagerV1}/images/uploadImage/noimage.gif");
        $("#externalLinkPath").val("");
        $("#externalLinkDes").val("");
        if(externalLinkImg != undefined && externalLinkImg != 'undefined'){
            $("#newmainImgPath").attr("src", externalLinkImg);
        }
        if(externalLinkPath != undefined && externalLinkPath != 'undefined'){
            $("#externalLinkPath").val(externalLinkPath);
        }
        if(externalLinkDes != undefined && externalLinkDes != 'undefined'){
            $("#externalLinkDes").val(externalLinkDes);
        }
        layer.open({
            type: 1,
            title: "战队广告维护",
            area: ['500px', '500px'],
            content: $("#showDiv")
        });
    }
</script>
</html>